﻿@{
    ViewBag.Title = "Home Page";
}



<div id="root"></div>


<br />
<br />
<br />
<br />

<div> 
    <a id="linkCategory" href="#">Choose category</a>
</div>


<div id="dialog">
	<p>This is the default dialog which is useful for displaying information. 
    The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<script src="/Scripts/pluginDemo.js" type="text/javascript"></script>

<script type="text/javascript">

    var mouse_x = 0;
    var mouse_y = 0;

    document.body.onmousemove = function (e) {
        mouse_x = e.x;
        mouse_y = e.y;
    };


    $(document).ready(function () {
        $('#dialog').toggle();
        $('#linkCategory').click(function () {
            $('#dialog').dialog({
                position: [mouse_x, mouse_y + 20],
                close: function (event, ui) {
                    alert('closed');
                }
            });
        });
    });
</script>

